<template>
  <div class="save">
    <header>
      <van-nav-bar
        class="back"
        left-text="我的收藏"
        left-arrow
        @click-left="onClickLeft"
      />
    </header>
    <main>
      <div
        class="good"
        v-for="(item, index) in favlist"
        :key="index"
        @click="goSort(item)"
      >
        <div class="img-box">
          <img :src="item.picUrl" alt="" />
        </div>
        <section class="dess">
          <h4>{{ item.name }}</h4>
          <div class="price">
            <span style="color: orange">★{{( item.wmPoiScore/10)}}</span
            >&nbsp;&nbsp;
            <span>{{ item.monthSalesTip }}</span>
            <van-button type="info" @click="send(item)">商家配送</van-button>
          </div>
          <div class="desc">
            <section>
              <span>{{ item.minPriceTip }}&nbsp;{{ item.shippingFeeTip }} </span>
            </section>
            <section>
              <span>{{ item.deliveryTimeTip }}</span> &nbsp;
            <span style="color: orange">{{ item.distance }}</span>
            </section>
          </div>
          <div class="jintie">
            <span v-for="(a,b) in item.discounts2" :key="b">{{a.info}}&nbsp;</span>
          </div>
        </section>
      </div>
    </main>
  </div>
</template>

<script>
import {shop_favlist} from "../../api/index2"
export default {
    data(){
        return{
            favlist:[]
        }
    },
  methods: {
    onClickLeft() {
      this.$router.back();
    },
    goSort(item) {
    }, 
    send(item){
      this.$router.push("/MyAddress")
    }
  },
  mounted(){
    // console.log(localStorage.getItem("userid")/1);
    shop_favlist({userid:localStorage.getItem("userid")}).then((res)=>{
        if(res.data.code==200){
            this.favlist=res.data.list;
        }
    })
  }

};
</script>

<style scoped>
.save{
  width: 100%;
  box-sizing: border-box;
  height: 100%;
}
main .good{
 width: 100%;
 padding: 0 15px;
 box-sizing: border-box;
 display: flex;
 border-bottom: 1px solid rgb(207, 207, 207);
 margin-bottom: 10px;
 padding-bottom: 20px;
}
main .good .img-box{
  width: 90px;
  height: 90px;
  margin-right: 15px;
  /* margin-top: 15px; */
  line-height: 90px;
  text-align: center;
  /* border: 1px solid red; */
}
main .good .img-box img{
  width: 100%;
  height: 100%;
  display: block;
}
main .good .dess{
  flex: 1;
  line-height: 25px;
}
main .good .dess .price{
  font-size: 13px;
  color: gray;
  position: relative;
}
main .good .dess .price .van-button{
  position: absolute;
  right: 0;
  height: 22px;
  font-size: 12px;
  background-color: rgb(42, 153, 238);
  border: none;
}
main .good .desc{
  font-size: 12px;
  color: gray;
  display: flex;
  justify-content: space-between;
}
main .good .jintie{
  font-size: 10px;
  color: gray;
  color: red;
}
main .good .jintie span{
  background-color: rgb(255, 243, 243);
  margin-right: 10px;
}
</style>